// ./src/components/Users/UserList.jsx
import React, { Component, PropTypes } from 'react';

// ����antd��UI����
import { Modal,Button,Table, message, Popconfirm } from 'antd';
import styles from './UserList.css';
// ���� stateless ��д��
const UserList = ({
    total,
    current,
    loading,
    dataSource,
    addUser,
}) => {
  const columns = [{
    title: '姓名',
    dataIndex: 'name',
    key: 'name',
    render: (text) => <a href="#">{text}</a>,
  }, {
    title: '年龄',
    dataIndex: 'age',
    key: 'age',
  }, {
    title: '家庭住址',
    dataIndex: 'address',
    key: 'address',
  }, {
    title: '性别',
    dataIndex: 'sex',
    key: 'sex',
  }, {
    title: '所属部门',
    dataIndex: 'dept',
    key: 'dept',
  }, {
    title: '职位',
    dataIndex: 'position',
    key: 'position',
  }, {
    title: '联系方式',
    dataIndex: 'phone',
    key: 'phone',
  }, {
    title: '操作',
    key: 'operation',
    render: (text, record) => (
      <p>
        <a onClick={()=>onEdit()}>修改</a>
        &nbsp;
        <Popconfirm title="确定删除？" onConfirm={()=>{console.log(record.name)}}>
          <a >删除</a>
        </Popconfirm>
      </p>
    ),
  }];


  const pagination = {
    total,
    current,
    pageSize: 1,
    onChange: (page)=>{
      console.log(page);
  },
  };

  return (
    <div className={styles.listDiv}>

    <Button type="primary" onClick={()=>addUser()}>添加用户</Button>

      <Table
        columns={columns}
        dataSource={dataSource}
        loading={loading}
        rowKey={record => record.id}
        pagination={pagination}
      />

  </div>
  );
}

export default UserList;
